<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <!--引入css样式文件-->
    <link href="../../css/qian/indexbox5.css" rel="stylesheet" />
    <!--引入js文件-->
    <script type="text/javascript" src="../../js/qian/xx.js"></script>
    <!--引用jQuery函数库(要用dist下的所有路径文件)-->
    <script src="../../lib/jQuery-3.6.min.js"></script>
    <script src="../../lib/jQuery.min.js"></script>
    <script src="../../lib/jquery.color.js"></script>
    <title>Document</title>
    <style>
        * {
            margin: 0;
            padding: 0;
            list-style: none;

        }

        body {
            background: url(../../images/qian/img/bg5_20180801.png);
            background-size: 100%;
        }
    </style>

</head>

<body>
    <div class="box5">
        <div class="box501"> <img src="../../images/qian/xt3.png" alt="">
            <p>宣传教育</p>
        </div>

        <!-- --------------------------------------------------------------- -->
        <div class="content">
            <div class="box502_xcyp">
                <div class="box502_toubu">
                    <span class>宣传影片</span>
                    <span class>交警说法</span>
                    <span class="box502q">典型案列</span>
                </div>
                <hr class="xian1">
                <div class="box502xian">
                    <p>庆祝泸职院成立120周年泸职交警《永不褪色》 </p>
                    <p><a href=""></a>停车场交通安全管理警示教育培训视频</p>
                    <p><a href=""></a>共享单车、小轿车安全教育警示片</p>
                    <p><a href=""></a>停车场交通安全管理警示教育培训视频</p>
                    <p><a href=""></a>《心的方向》---泸职交警铁骑2.0宣传曲</p>
                </div>
                <div class="box502xian">
                    
                    <p><a href=""></a>交警说法:男子超车后掌掴出租车司机熊...</p>
                    <p><a href=""></a>交警说法:公交车超速失控 熊sir请你...</p>
                    <p><a href=""></a>交警说法:带了没戴，外卖小哥见了交警才戴头盔</p>
                    <p><a href=""></a>交警说法:物业禁止电动车停放，熊sir约谈负责人</p>
                    <p><a href=""></a>交警说法:男子不但未取得机动车驾驶证，还酒后驾驶</p>
                    <p><a href=""></a>交警说法:醉酒男子无法无天</p>
                </div>
                <div class="box502xian">
                    <p><a href=""></a>听！车辆轰鸣声响彻整条街！网友微博举报后...</p>
                    <p><a href=""></a>车顶惊现两个孩子，还有一名家长在拍照？千万不要大意</p>
                    <p><a href=""></a>赶紧纠正！！！骑行电动车时这个疏忽十分危险</p>
                    <p><a href=""></a>12起涉泥头车亡人事故，多家企业被追责！</p>
                    <p><a href=""></a>泥头车无视红灯直接闯，下一秒悲剧！血的教...</p>
                </div>
            </div>
            <div class="box503">
                <span>交警风采</span>
                <div class="box503_tupian">
                    <img class="box503_tufang" src="../../images/qian/9426831.jpeg" alt="12">
                    <img class="box503_tufang" src="../../images/qian/9342849.jpeg" alt="">
                    <img class="box503_tufang" src="../../images/qian/9148970.jpeg" alt="">
                    <img class="box503_tufang" src="../../images/qian/9103493.jpeg" alt="">
                </div>
                <div class="box503_toubu">
                    <p class="box503_1"><a href="http://szjj.sz.gov.cn/JTAQ/JJFC/content/post_9426831.html">快速反应
                            消除隐患</a></p>
                    <p><a href="http://szjj.sz.gov.cn/JTAQ/JJFC/content/post_9342849.html">真心为人民办事 人民心中的好警察</a></p>
                    <p><a href="http://szjj.sz.gov.cn/JTAQ/JJFC/content/post_9148970.html">泸州交警大队铁骑助迷路孩童与...</a></p>
                    <p><a href="http://szjj.sz.gov.cn/JTAQ/JJFC/content/post_9103493.html">泸职交警暖心护送走失儿童回家</a></p>
                </div>
            </div>
            <div class="box502shijian">
                <p>[06-13]</p><br><br>
                <p>[06-18]</p><br><br>
                <p>[07-08]</p><br><br>
                <p>[09-20]</p><br><br>
                <p>[10-11]</p>
            </div>
        </div>
        <!-- ---------------------------------------------------------------------------- -->
        <div class="box504">
            <span class="box504q"><a href="../../html/qian/tu.html">安全常识</a></span>
            <span class="box504q"><a href="http://szjj.sz.gov.cn/JTAQ/JTBZTJ/index.html">标志图解</a></span>
            <span class="box504q"><a href="http://szjj.sz.gov.cn/JTAQ/XCYPSP/JJSF/index.html">交警说法</a></span>
            <span class="box504q"><a href="http://szjj.sz.gov.cn/JTAQ/XCBYZJ/index.html">安全标语</a></span>
            <span class="box504q"><a href="http://szjj.sz.gov.cn/JTAQ/HJMH/index.html">宣传图画</a></span>
        </div>
    </div>
 
</body>
<script>  $(function () {
        $(".box502_toubu span").click(function () {
            $(this).addClass("box502q").siblings().removeClass("box502q");
            var index = $(this).index();
            console.log(index);
            $(".box502_xcyp .box502xian").eq(index).show().siblings().hide();
        });
    })
</script>
<script> $(function () {
        $(".box503_toubu p").hover(function () {
            $(this).addClass("box503_1").siblings().removeClass("box503_1");
            var index = $(this).index();
            console.log(index);
            $(".box503_tupian .box503_tufang").eq(index).show().siblings().hide();
        });
    })
</script>

</html>